{include file="public/header" select="0" /}
<body class="bgc">
<div class="header">
    <i class="layui-icon layui-icon-left" onclick="load_href('{:url(\'user/index\')}',2)"></i> 我的订单
</div>
<ul class="pro-list-nav">
    <li data-type=""  class="{if !$Request.param.type}active{/if}">
        <div>全部</div>
        <p></p>
    </li>
    <li data-type="1" class="{if $Request.param.type == 1}active{/if}">
        <div>待支付</div>
        <p></p>
    </li>
    <li data-type="2" class="{if $Request.param.type == 2}active{/if}">
        <div>待发货</div>
        <p></p>
    </li>
    <li data-type="3" class="{if $Request.param.type == 3}active{/if}">
        <div>待收货</div>
        <p></p>
    </li>
    <li data-type="5" class="{if $Request.param.type == 5}active{/if}">
        <div>已完成</div>
        <p></p>
    </li>
</ul>
<ul class="my-order-list tpl_list"></ul>
{include file="public/footer" select="0" /}
<script id="template" type="text/html">
    {{# for(var i=0;i<d.data.length ;i++){ }}
    <li>
        <p class="flex-layout">订单号：{{d.data[i].sn}} <span>{{d.data[i].status}}</span></p>
        <ul class="submit-pro-list" onclick="load_href('{:url(\'order/my_order_details\')}?id={{d.data[i].id}}',2)">
            {{# for(var j=0;j<d.data[i].products.length ;j++){ }}
            <li>
                <p class="flex-center">
                    <img src="{{d.data[i].products[j].product_image}}" alt="">
                </p>
                <div class="center">
                    <p class="multi">{{d.data[i].products[j].product_title}}</p>
                </div>
                <div class="rgt">
                    <p class="price">￥<span>{{d.data[i].products[j].price}}</span></p>
                    <p>x{{d.data[i].products[j].num}}</p>
                </div>
            </li>
            {{# } }}
        </ul>
        <p class="order-price">实付款：<span>￥{{d.data[i].real_amount}}</span></p>
        <div class="order-btn">
            {{# if(d.data[i].status == '待支付'){ }}
            <a style="border: 1px solid #999;color:#999;" class="clearOrder" data-id="{{d.data[i].id}}">取消订单</a>
            <a class="bc" href="{:url('order/payment')}?id={{d.data[i].id}}">去支付</a>
            {{# }else if(d.data[i].status == "待收货") { }}
            <a class="bc receipt" data-id="{{d.data[i].id}}">确认收货</a>
            {{# } }}
        </div>
    </li>
    {{# } }}
</script>
<script>
    $(function () {
        getFlow('{$Request.param.type}', "{:url('order/getList')}");
        $(".pro-list-nav li").click(function () {
            $(this).addClass('active').siblings().removeClass('active');
            $(".tpl_list").empty();
            var type = $(this).attr('data-type');
            getFlow(type, "{:url('order/getList')}");
        });

        $('.tpl_list').on('click', '.clearOrder', function () {
            const id = $(this).attr('data-id');
            edit('clear', id, '确认要取消订单吗？')
        }).on('click', '.receipt', function () {
            const id = $(this).attr('data-id');
            edit('receipt', id, '是否确认收货？')
        }).on('click', '.refund', function () {
            const id = $(this).attr('data-id');
            edit('refund', id, '是否确认退货？')
        });

        function edit(type, id, msg) {
            layer.confirm(msg, {title: '请确认'}, function () {
                let load = layer.load(2);
                $.ajax({
                    type: 'POST',
                    url: '{:url("edit")}',
                    data: {type: type, id: id},
                    dataType: "json",
                    success: function (data) {
                        layer.close(load);
                        layer.msg(data.msg);
                        if (data.code == 1) {
                            $(".tpl_list").empty();
                            getFlow($(".active").attr('data-type'), "{:url('order/getList')}");
                        }
                    }
                });
            });
        }
    });
</script>
</body>
</html>